/**
 * Dear programmer:
 * When I wrote this code, only god and I knew how it worked.
 * Now, only god knows it!
 *
 * @author: lyl  Date: 2019-03-06 Time: 17:56
 *
 */
import React, {Component} from 'react';
import {Modal, SafeAreaView, ScrollView, Text, TouchableOpacity, View} from "react-native";
import {connect} from 'react-redux';
import {styles} from "./FiltersScreen.Style";
import {doSetPersonnelStatus_Filters,doGetOrderStatus,retrieveJqGrid} from "./Actions";
import {FetchStatus} from "../../../../../configuration/RequestConfiguration";
import LoadingView from "../../../../../component/LoadingView/LoadingView";
import {doDisplayWarnMessage} from "../../../../../component/Message/Action";
import {ReturnStatus} from "../../../../../configuration/ReturnStatus";
import DividingLineViewComponent from "../../../../../component/DividingLineViewComponent/DividingLineViewComponent";
import {COLOR_WHITE} from "../../../../../constant/PHColors";

class FiltersScreen extends Component {

    //标题
    static navigationOptions = ({navigation}) => ({
        headerTitle: `筛选`,
        headerRight: (
            <TouchableOpacity activeOpacity={0.9} onPress={()=>{
                navigation.state.params.navigatePress();
            }}>
                <View style={{ height: 44,paddingRight:10, flexDirection: 'row', justifyContent: 'flex-end', alignItems: 'center'}}>
                    <Text style={{fontSize: 16, color: '#212121'}}>
                        确定
                    </Text>
                </View>
            </TouchableOpacity>
        )
    });

    //构造
    constructor(props) {
        super(props);
        this.state={
            //工作状态
            workStatus:["所有员工","离线","空闲","工作中"],
            //工作状态文本
            workStatusText:"",
            //工单状态
            status:[],
            //工单状态文本
            orderStatusText:this.props.navigation.getParam("selectValue")["status"]?this.props.navigation.getParam("selectValue")["status"]:'',
            //部门文本
            departMentText:this.props.navigation.getParam("selectValue")["depart"]?this.props.navigation.getParam("selectValue")["depart"]:'',
            //楼型
            building:this.props.navigation.getParam("selectValue")["building"]?this.props.navigation.getParam("selectValue")["building"]:'',
            building_c:this.props.navigation.getParam("selectValue")["building_c"]?this.props.navigation.getParam("selectValue")["building_c"]:'全部',
            //房型
            rmtype:this.props.navigation.getParam("selectValue")["rmtype"]?this.props.navigation.getParam("selectValue")["rmtype"]:'',
            rmtype_c:this.props.navigation.getParam("selectValue")["rmtype_c"]?this.props.navigation.getParam("selectValue")["rmtype_c"]:'全部',
            //房型
            floor:this.props.navigation.getParam("selectValue")["floor"]?this.props.navigation.getParam("selectValue")["floor"]:'',
            floor_c:this.props.navigation.getParam("selectValue")["floor_c"]?this.props.navigation.getParam("selectValue")["floor_c"]:'全部',
            //房务
            roomServiceArr:[],
            roomService:this.props.navigation.getParam("selectValue")["roomService"]?this.props.navigation.getParam("selectValue")["roomService"]:'',
            roomService_c:this.props.navigation.getParam("selectValue")["roomService_c"]?this.props.navigation.getParam("selectValue")["roomService_c"]:'所有房间',
            //模态状态
            modalVisible: false,
            //模态标题
            modalHeaderText:"",
            //模态查询类别Key
            valueKey:"",
            //回调结果json
            outJson:{},
        }
    }

    //模态状态和标题
    _setModalVisible = (modalHeaderText="",valueKey="") => {
        this.setState({
            modalVisible: !this.state.modalVisible,
            modalHeaderText:modalHeaderText,
            valueKey:valueKey,
        });
    };

    //状态改变
    componentWillReceiveProps(nextProps): void {
        let {dispatch} = this.props;
        if (nextProps.onPersonnelStatus_Filters !== this.props.onPersonnelStatus_Filters && nextProps.onPersonnelStatus_Filters.fetchStatus === FetchStatus.Success) {

            if (nextProps.onPersonnelStatus_Filters.RETURN===ReturnStatus.Success ) {
                let {workStatus="0",departMent=this.props.onDep,DATA}=nextProps.onPersonnelStatus_Filters;
                dispatch(doSetPersonnelStatus_Filters(false, workStatus, departMent));

                DATA.map((item) => {
                    if (item.code === this.props.onDep && this.state.departMentText === "")
                        this.state.departMentText = item.name;
                });

                this.state.workStatusText = this.state.workStatus[workStatus];

            }else{
                dispatch(doDisplayWarnMessage(nextProps.onPersonnelStatus_Filters.MSG));
            }
        }

        //工单状态
        if (nextProps.onDepartRepairOrderGetStatus !== this.props.onDepartRepairOrderGetStatus && nextProps.onDepartRepairOrderGetStatus.fetchStatus === FetchStatus.Success) {
            if (nextProps.onDepartRepairOrderGetStatus.RETURN === ReturnStatus.Success) {
                let selectStatus = nextProps.onDepartRepairOrderGetStatus.DATA;
                this.setState({
                    status: selectStatus
                });
            } else {

            }
        }

        //房务
        if (nextProps.onGetRoomService !== this.props.onGetRoomService && nextProps.onGetRoomService.fetchStatus === FetchStatus.Success) {
            if (nextProps.onGetRoomService.RETURN === ReturnStatus.Success) {
                let selectStatus = nextProps.onGetRoomService.DATA;
                // console.log("9999999999999999999999999999"+JSON.stringify(selectStatus))roomServiceArr
                this.setState({
                    roomServiceArr: selectStatus
                });
            } else {

            }
        }
    }

    //获取初始化数据
    componentDidMount(): void {
        let {dispatch} = this.props;
        dispatch(doSetPersonnelStatus_Filters(true));
        dispatch(doGetOrderStatus('{}'));

        this.props.navigation.setParams({navigatePress:this.onPressToDataBack});

        if(this.props.navigation.getParam("searchCode").indexOf("roomService")>-1){
            dispatch(retrieveJqGrid());
        }

    }

    onPressToDataBack=()=> {
        // this.props.navigation.navigate(this.props.navigation.getParam("pageBack"));     //返回上一页
        this.props.navigation.goBack();
        this.props.navigation.state.params.dataBack(this.state.outJson)   //回调
    };

    //渲染
    render() {
        let _this = this;
        let {onPersonnelStatus_Filters} = this.props;
        if (!onPersonnelStatus_Filters.fetchStatus||(onPersonnelStatus_Filters.fetchStatus === FetchStatus.Success&&typeof onPersonnelStatus_Filters["DATA"] !== "undefined")) {
            return (
                <SafeAreaView style={styles.body}>
                    <ScrollView style={styles.body}>
                        <View style={styles.viewStyle}>
                            {(_this.props.navigation.getParam("searchCode").indexOf("workStatus")>-1)&&(
                                <TouchableOpacity style={styles.touchableOpacityStyleWithLine} activeOpacity={0.8} onPress={() => {
                                    this._setModalVisible("工作状态","workStatusText");
                                }}>
                                    <View style={styles.textBox}>
                                        <Text style={styles.textTitleStyle}>
                                            工作状态
                                        </Text>
                                        <Text style={styles.textStyle}>
                                            {this.state.workStatusText}
                                        </Text>
                                    </View>
                                </TouchableOpacity>
                            )}

                            {(_this.props.navigation.getParam("searchCode").indexOf("depart")>-1)&&(
                                <TouchableOpacity style={styles.touchableOpacityStyle} activeOpacity={0.8} onPress={() => {
                                    this._setModalVisible("部门","departMentText");
                                }}>
                                    <View style={styles.textBox}>
                                        <Text style={styles.textTitleStyle}>
                                            部门
                                        </Text>
                                        <Text style={styles.textStyle}>
                                            {this.state.departMentText}
                                        </Text>
                                    </View>
                                </TouchableOpacity>
                            )}

                            {(_this.props.navigation.getParam("searchCode").indexOf("status")>-1)&&(
                                <TouchableOpacity style={styles.touchableOpacityStyle} activeOpacity={0.8} onPress={() => {
                                    this._setModalVisible("工单状态","orderStatusText");
                                }}>
                                    <View style={styles.textBox}>
                                        <Text style={styles.textTitleStyle}>
                                            工单状态
                                        </Text>
                                        <Text style={styles.textStyle}>
                                            {this.state.orderStatusText}
                                        </Text>
                                    </View>
                                </TouchableOpacity>
                            )}

                            {(_this.props.navigation.getParam("searchCode").indexOf("building")>-1)&&(
                                <TouchableOpacity style={styles.touchableOpacityStyle} activeOpacity={0.8} onPress={() => {
                                    this._setModalVisible("楼型","building");
                                }}>
                                    <View style={styles.textBox}>
                                        <Text style={styles.textTitleStyle}>
                                            楼型
                                        </Text>
                                        <Text style={styles.textStyle}>
                                            {this.state.building_c}
                                        </Text>
                                    </View>
                                </TouchableOpacity>
                            )}

                            {(_this.props.navigation.getParam("searchCode").indexOf("rmtype")>-1)&&(
                                <TouchableOpacity style={styles.touchableOpacityStyle} activeOpacity={0.8} onPress={() => {
                                    this._setModalVisible("房型","rmtype");
                                }}>
                                    <View style={styles.textBox}>
                                        <Text style={styles.textTitleStyle}>
                                            房型
                                        </Text>
                                        <Text style={styles.textStyle}>
                                            {this.state.rmtype_c}
                                        </Text>
                                    </View>
                                </TouchableOpacity>
                            )}

                            {(_this.props.navigation.getParam("searchCode").indexOf("floor")>-1)&&(
                                <TouchableOpacity style={styles.touchableOpacityStyle} activeOpacity={0.8} onPress={() => {
                                    this._setModalVisible("楼层","floor");
                                }}>
                                    <View style={styles.textBox}>
                                        <Text style={styles.textTitleStyle}>
                                            楼层
                                        </Text>
                                        <Text style={styles.textStyle}>
                                            {this.state.floor_c}
                                        </Text>
                                    </View>
                                </TouchableOpacity>
                            )}

                            {(_this.props.navigation.getParam("searchCode").indexOf("roomService")>-1)&&(
                                <TouchableOpacity style={styles.touchableOpacityStyle} activeOpacity={0.8} onPress={() => {
                                    this._setModalVisible("房务","roomService_c");
                                }}>
                                    <View style={styles.textBox}>
                                        <Text style={styles.textTitleStyle}>
                                            房务
                                        </Text>
                                        <Text style={styles.textStyle}>
                                            {this.state.roomService_c}
                                        </Text>
                                    </View>
                                </TouchableOpacity>
                            )}
                        </View>
                    </ScrollView>
                    <Modal transparent={true} visible={this.state.modalVisible}>
                        <TouchableOpacity style={{flex: 1}} activeOpacity={1} onPress={this._setModalVisible}>
                            <View style={styles.modalContainer}>
                                <View style={styles.modalBox}>
                                    <View style={styles.modalHeader}>
                                        <Text style={styles.modalHeaderText}>
                                            请选择{this.state.modalHeaderText}
                                        </Text>
                                    </View>
                                    <ScrollView style={styles.modalView}>
                                        {(this.state.modalHeaderText === "部门")&&(
                                            onPersonnelStatus_Filters["DATA"].map((item,key)=>{
                                                return(
                                                    <View key={"dep_"+key}>
                                                        <TouchableOpacity activeOpacity={0.8} onPress={() => {
                                                            let outJson = this.state.outJson;
                                                            outJson.depart = item.name;
                                                            this._setModalVisible();
                                                            this.setState({
                                                                departMentText:item.name,
                                                                outJson: outJson,
                                                            })
                                                        }}>
                                                            <View style={styles.modalItemView}>
                                                                <Text style={this.state[this.state.valueKey] === item.name?styles.modalItemTextCheck:styles.modalItemText}>
                                                                    {item.name}
                                                                </Text>
                                                            </View>
                                                        </TouchableOpacity>
                                                        <DividingLineViewComponent lineHeight={1}/>
                                                    </View>
                                                )
                                            })
                                        )}
                                        {(this.state.modalHeaderText === "工作状态")&&(
                                            this.state.workStatus.map((item,key)=>{
                                                return(
                                                    <View key={"workStatus_"+key}>
                                                        <TouchableOpacity style={styles.modalItemView} activeOpacity={0.8} onPress={() => {

                                                        }}>
                                                            <View style={styles.modalItemView}>
                                                                <Text style={this.state[this.state.valueKey] === item?styles.modalItemTextCheck:styles.modalItemText}>
                                                                    {item}
                                                                </Text>
                                                            </View>
                                                        </TouchableOpacity>
                                                        <DividingLineViewComponent lineHeight={1}/>
                                                    </View>
                                                )
                                            })
                                        )}
                                        {(this.state.modalHeaderText === "工单状态")&&(
                                            this.state.status.map((item,key)=>{
                                                return(
                                                    <View key={"orderStatus_"+key}>
                                                        <TouchableOpacity style={styles.modalItemView} activeOpacity={0.8} onPress={() => {
                                                            let outJson = this.state.outJson;
                                                            outJson.status = item['STATUS'];
                                                            this._setModalVisible();
                                                            this.setState({
                                                                orderStatusText:item['STATUS'],
                                                                outJson: outJson,
                                                            })
                                                        }}>
                                                            <View style={styles.modalItemView}>
                                                                <Text style={this.state[this.state.valueKey] === item['STATUS']?styles.modalItemTextCheck:styles.modalItemText}>
                                                                    {item['STATUS']}
                                                                </Text>
                                                            </View>
                                                        </TouchableOpacity>
                                                        <DividingLineViewComponent lineHeight={1}/>
                                                    </View>
                                                )
                                            })
                                        )}
                                        {(this.state.modalHeaderText === "楼型")&&(
                                            [{"code":"","descript1":"全部"}].concat(this.props.onCache.building).map((item,key)=>{
                                                return(
                                                    <View key={"building_"+key}>
                                                        <TouchableOpacity style={styles.modalItemView} activeOpacity={0.8} onPress={() => {
                                                            let outJson = this.state.outJson;
                                                            outJson.building = item['code'];
                                                            outJson.building_c = item['descript1'];
                                                            this._setModalVisible();
                                                            this.setState({
                                                                building:item['code'],
                                                                building_c:item['descript1'],
                                                                outJson: outJson,
                                                            })
                                                        }}>
                                                            <View style={styles.modalItemView}>
                                                                <Text style={this.state[this.state.valueKey] === item['code']?styles.modalItemTextCheck:styles.modalItemText}>
                                                                    {item['descript1']}
                                                                </Text>
                                                            </View>
                                                        </TouchableOpacity>
                                                        <DividingLineViewComponent lineHeight={1}/>
                                                    </View>
                                                )
                                            })
                                        )}
                                        {(this.state.modalHeaderText === "房型")&&(
                                            [{"code":"","descript1":"全部"}].concat(this.props.onCache.rmtype).map((item,key)=>{
                                                return(
                                                    <View key={"rmtype_"+key}>
                                                        <TouchableOpacity style={styles.modalItemView} activeOpacity={0.8} onPress={() => {
                                                            let outJson = this.state.outJson;
                                                            outJson.rmtype = item['code'];
                                                            outJson.rmtype_c = item['descript1'];
                                                            this._setModalVisible();
                                                            this.setState({
                                                                rmtype:item['code'],
                                                                rmtype_c:item['descript1'],
                                                                outJson: outJson,
                                                            })
                                                        }}>
                                                            <View style={styles.modalItemView}>
                                                                <Text style={this.state[this.state.valueKey] === item['code']?styles.modalItemTextCheck:styles.modalItemText}>
                                                                    {item['descript1']}
                                                                </Text>
                                                            </View>
                                                        </TouchableOpacity>
                                                        <DividingLineViewComponent lineHeight={1}/>
                                                    </View>
                                                )
                                            })
                                        )}
                                        {(this.state.modalHeaderText === "楼层")&&(
                                            [{"code":"","descript1":"全部"}].concat(this.props.onCache.floor).map((item,key)=>{
                                                return(
                                                    <View key={"floor_"+key}>
                                                        <TouchableOpacity style={styles.modalItemView} activeOpacity={0.8} onPress={() => {
                                                            let outJson = this.state.outJson;
                                                            outJson.floor = item['code'];
                                                            outJson.floor_c = item['descript1'];
                                                            this._setModalVisible();
                                                            this.setState({
                                                                floor:item['code'],
                                                                floor_c:item['descript1'],
                                                                outJson: outJson,
                                                            })
                                                        }}>
                                                            <View style={styles.modalItemView}>
                                                                <Text style={this.state[this.state.valueKey] === item['code']?styles.modalItemTextCheck:styles.modalItemText}>
                                                                    {item['descript1']}
                                                                </Text>
                                                            </View>
                                                        </TouchableOpacity>
                                                        <DividingLineViewComponent lineHeight={1}/>
                                                    </View>
                                                )
                                            })
                                        )}
                                        {(this.state.modalHeaderText === "房务")&&(
                                            this.state.roomServiceArr.map((item,key)=>{
                                                return(
                                                    <View key={"roomService_"+key}>
                                                        <TouchableOpacity style={styles.modalItemView} activeOpacity={0.8} onPress={() => {
                                                            let outJson = this.state.outJson;
                                                            outJson.roomService = item;
                                                            outJson.roomService_c = item['title'];
                                                            this._setModalVisible();
                                                            this.setState({
                                                                roomService:item,
                                                                roomService_c:item['title'],
                                                                outJson: outJson,
                                                            })
                                                        }}>
                                                            <View style={styles.modalItemView}>
                                                                <Text style={this.state[this.state.valueKey] === item['title']?styles.modalItemTextCheck:styles.modalItemText}>
                                                                    {item['title']}
                                                                </Text>
                                                            </View>
                                                        </TouchableOpacity>
                                                        <DividingLineViewComponent lineHeight={1}/>
                                                    </View>
                                                )
                                            })
                                        )}
                                    </ScrollView>
                                </View>
                            </View>
                        </TouchableOpacity>
                    </Modal>
                </SafeAreaView>

            )
        }else{
            return <LoadingView/>
        }
    }


}

//状态与组件绑定
const props = state => {
    return {
        onPersonnelStatus_Filters:state.onPersonnelStatus_Filters,
        onDepartRepairOrderGetStatus: state.onDepartRepairOrderGetStatus,//工单状态
        onDep: state.onDep,
        onCache: state.onCache,
        onGetRoomService:state.onGetRoomService,//房务
    }
};
export default FiltersScreen = connect(props)(FiltersScreen);
